<% layout('/layouts/default.html', {title: '', libs: ['dataGrid']}){ %>
<!-- <link rel="stylesheet" href="${ctxStatic}/modules/sys/sysDesktop.css?${_version}"> -->
<style>
    *{
        margin:0px;
        padding:0px
    }
    p{
        margin:0px
    }

    .kanHeader{
        position: relative;
        height: 50px;
        line-height: 50px;
        background: #fff;
        margin-bottom: 15px;
    }
    .kanHeader p {
        font-size: 16px;
        font-family: Microsoft YaHei;
        font-weight: 700;
        color: #231815;
    }
    .workKey {
        border-radius: 4px;
        margin: 0 0 15px 0;
        text-align: center;
        background: #fff;
        -webkit-transition: -webkit-transform .3s;
        transition: -webkit-transform .3s;
        transition: transform .3s;
        transition: transform .3s,-webkit-transform .3s;
        padding: 0 24px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding-bottom: 15px;
        position: relative;
    }
    .shipTop {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        height: 54px;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        width: 100%;
    }
    .shipTop h1 {
        font-size: 16px;
        font-weight: 500;
        margin:0px
    }
    .active {
        color: #4b87ff;
    }
    .huls span {
        padding-left: 10px;
        font-size: 14px;
        cursor: pointer;
    }
    .huizong{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: distribute;
        justify-content: space-around;
    }
    .huizong p{
        border-radius: 4px;
        text-align: center;
        height: 110px;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        margin-right: 35px;
        cursor: pointer;
    }
    .huizong p span{
        display: block;
        color: #fff;
        font-size: 18px;
        padding-top: 20px;
    }
    .huizong p:last-child {
        margin-right: 0;
    }
    .workKey .shipTop .leaderName{
        position: absolute;
        right: 162px;
    }
    .lehandBtn {
        border: 1px solid  #79a5f0!important;
        padding: 6px 15px;
        font-size: 12px;
        border-radius: 3px;
        background: #ffffff;
        color: #79a5f0!important;
    }
    .workKey .shipSeach {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin-bottom: 15px;
    }
    .sheachBao {
        margin-top: 8px;
    }
    .sheachBao span {
        display: inline-block;
        margin-right: 10px;
        border-radius: 4px;
        font-size: 12px;
        color: #fff;
        padding: 0 5px;
        cursor: pointer;
        line-height: 24px;
    }
    .rightData .dataList span {
        padding-left: 10px;
        font-size: 14px;
        cursor: pointer;
    }
    .shipdivt{
        width: 300px;
        padding-left: 12px;
        padding-top: 12px;
       margin-top:10px;
        box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);

    }
    .shipdivt li{
        display: inline-block;
        height: 32px;
        padding: 0 10px;
        line-height: 30px;
        font-size: 12px;
        color: #409eff;
        border: 1px solid #d9ecff;
        border-radius: 4px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 58px;
        cursor: pointer;
        text-align: center;
        margin-right:10px;
        margin-bottom: 8px;
    }
    .shipdivt:before {
        width: 0;
        height: 0;
        border-bottom: 6px solid #fff;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        position: absolute;
        top:-6px;
        right: 60px;
        content: " ";
        border-width: 6px;
    }
    .ui-jqgrid-bdiv{
        height: 400px !important;
    }
</style>
<div class="content pb0">
<!--    <div class="kanHeader">-->
<!--        <p data-v-53bf5353="" style="float: left; padding-left: 24px; cursor: pointer;">-->
<!--            <i class="fa fa-fw fa-exclamation-circle" style="color: #f55200!important;"></i> <a href="${ctx}/msg/list">您有<span data-v-53bf5353="" id="leaderMsg" max="99" style="color: rgb(245, 82, 0);">4</span>条待处理事项及待调度事项，请处理。</a> </p>-->
<!--    </div>-->
    <div class="workKey">
        <div class="shipTop">
            <h1>工作汇总</h1>
            <div class="rightData">
                <p class="dataList huls">
                    <span onclick="dataGetSt('1')">本周</span>
                    <span onclick="dataGetSt('2')">上周</span>
                    <span onclick="dataGetSt('3')">本月</span>
                    <span onclick="dataGetSt('4')">本季</span>
                    <span class="active" onclick="dataGetSt('5')">本年</span>
                    <span onclick="dataGetSt('')">所有</span>
                </p>
            </div>
        </div>
        <div class="huizong">
            <span id="dateParam" style="display: none"></span>
            <p style="background-color: #ff4d4d" onclick="statuDetails(1)">
                <span>进度滞后</span>
                <span id="zhiSate">0</span>
            </p>
            <p style="background-color: #ff8b19" onclick="statuDetails(2)">
                <span>逾期未反馈</span>
                <span id="yuqiSate">0</span>
            </p>
            <p style="background-color: #4b87ff" onclick="statuDetails(3)">
                <span>序时推进</span>
                <span id="xushiSate">0</span>
            </p>
            <p style="background-color: #1abd6e" onclick="statuDetails(4)">
                <span>已完成</span>
                <span id="wanSate">0</span>
            </p>
        </div>
    </div>
    <div class="workKey">
        <div class="shipTop">
            <h1>任务清单</h1>
            <p class="leaderName" >
                当前领导：<span id="leaderName"></span>
            </p>

            <div class="btn-group">
                <button type="" class="lehandBtn" data-toggle="dropdown">其他领导工作汇总
                    </button>
                <ul class="dropdown-menu pull-right shipdivt" role="menu">
                    <p class="leadArr"></p>
                    <% for(var dict in @DictUtils.getDictList('dc_task_leaders')){ %>
                        <li onclick="leaderId('${dict.dictValue}','${dict.dictLabel}')">${dict.dictLabel}</li>
                    <% } %>
                    <li onclick="leaderId('${@UserUtils.getUser().getUserCode()}','${@UserUtils.getUser().getUserName()}')">我</li>
                </ul>
            </div>
        </div>
        <div class="shipSeach">
            <div class="shipSeachEn">

                <div style="float: right; margin-right: 16px">
                    <#form:form id="searchForm" model="${dcSupTaskAction}" action="${ctx}/home/homePage/queryWorkList" method="post" class="form-inline"
                    data-page-no="${parameter.pageNo}" data-page-size="${parameter.pageSize}" data-order-by="${parameter.orderBy}">
                    <div style="">
                        <div class="form-group" style="float: left;margin-bottom:0px">
                            <label style="float: left;display: inline-block;line-height: 32px;font-weight: normal;padding-right: 5px;margin-bottom: 0px">
                                ${text('任务类型')}：
                            </label>
                            <div style="float: left;width: 150px;margin-right: 10px;text-align: left;">
                                <#form:select path="taskTypeCode" items="${keyPointList}" blankOption="true" data-placeholder="请选择" itemLabel="dictLabel" itemValue="dictValue" class="form-control width-120 required" />
                            </div>
                            <div style="float: left">
                                <#form:input path="taskTitle" class="form-control" placeholder="请输入标题或内容查询"/>
                            </div>
                            <#form:input path="taskProgress" style="display:none"/>
                            <#form:input path="taskLeader" style="display:none"/>
                            <#form:input path="timeParam" style="display:none"/>
                        </div>
                        <div class="form-group" style="float: left;margin-left: 10px;margin-bottom:0px">
                            <button type="submit" class="btn btn-primary btn-sm" style="background-color: #ffffff !important;color:#1e5edb">${text('查询')}</button>
                            <button type="reset" class="btn btn-default btn-sm" onclick="ret(1)" style="background: #FFF;border: 1px solid #DCDFE6;color: #606266;">${text('重置')}</button>
                        </div>
                    </div>

                </#form:form>
                </div>
            </div>
            <div class="rightData">
                <p class="dataList dataList1">
                    <span onclick="dataGet('1','dataGrid','searchForm')">本周</span>
                    <span onclick="dataGet('2','dataGrid','searchForm')">上周</span>
                    <span onclick="dataGet('3','dataGrid','searchForm')">本月</span>
                    <span onclick="dataGet('4','dataGrid','searchForm')">本季</span>
                    <span class="active" onclick="dataGet('5','dataGrid','searchForm')">本年</span>
                    <span onclick="dataGet('','dataGrid','searchForm')">所有</span>
                </p>
            </div>
        </div>
        <table id="dataGrid"></table>
        <div id="dataGridPage"></div>
    </div>

</div>
    <div class="workKey" style="margin-bottom: 0px;display: none" id="roll1_top2">
        <div class="shipTop">
            <h1>主要经济指标全省排名</h1>
            <p style="cursor: pointer; color: #4b87ff" onclick="more()" >更多</p>
        </div>
        <div class="box-echarts">
            <div style="height: 350px; width: 100%" id="myChart"></div>
        </div>

    </div>

    <div class="row">

        <section class="col-md-5 ui-sortable ui-sortable">

        </section>
    </div>
</div>

<% } %>
<script src="${ctxStatic}/jquery/jquery-ui-sortable-1.12.1.min.js"></script>
<script src="${ctxStatic}/echarts/4.2/echarts.min.js"></script>

<script>
   var  myChart1;
    function statuBtn(taskStatus,dataId,formId){
        $("#"+formId+ " #taskProgress").val(taskStatus)
        $('#'+dataId).dataGrid('reloadGrid');
    }

    //时间
   $("#searchForm #timeParam").val('5')
   //$("#searchForm2 #timeParam").val('')
   $("#searchForm #taskLeader").val('${@UserUtils.getUser().getUserCode()}')
 //  $("#searchForm2 #taskLeader").val('${@UserUtils.getUser().getUserCode()}')
   function dataGet(timeStatus,dataId,formId){
       $("#searchForm #timeParam").val(timeStatus)
    //   $("#searchForm2 #timeParam").val(timeStatus)
       $('#'+dataId).dataGrid('reloadGrid');
   }
    // 主要经济指标
    findScoreInfo()
    function findScoreInfo() {
        // $.ajax({
        //     url: "${ctx}/home/provinceMajor/getRank",
        //     type: "post",
        //     cache: false,
        //     data: {},
        //     dataType: "json",
        //     success: function(res){
        //         myChart1 = echarts.init(document.getElementById('myChart'));
        //         myChart1.setOption({
        //             tooltip : {
        //                 trigger: 'axis',
        //                 //柱形图tooltip内容优化代码
        //                 formatter: function (datas) {
        //                     var resName = datas[0].name + "<br/>";
        //                     for (var i = 0, length = datas.length; i < length; i++) {
        //                         //res.xAxisData是接口返回数据
        //                         // var index = res.xAxisData.findIndex(function (item) {
        //                         //     return item === datas[i].name
        //                         // }
        //                         // );
        //                         var index = 0;
        //                         for(var j = 0, length2 = res.xAxisData.length; j < length2; j++){
        //                             if(res.xAxisData[j] === datas[i].name){
        //                                 index = j;
        //                             }
        //                         }
        //                         var listp = res.tooltipData[index];
        //                     }
        //                     resName = resName + "省内排名：" + listp;
        //                     return resName;
        //                 },
        //             },
        //             color: ["#5087EC"],
        //             toolbox: {
        //                 show: false,
        //             },
        //             grid : {
        //                 top: "3%",
        //                 left: "0%",
        //                 right: "4%",
        //                 bottom: "15px",
        //                 containLabel: true,
        //             },
        //             xAxis : [
        //                 {
        //                     type : 'category',
        //                     axisLabel: {
        //                         //坐标轴刻度标签的相关设置。
        //                         interval: 0,
        //                         rotate: "45",
        //                     },
        //                     data : res.xAxisData
        //                 }
        //             ],
        //             yAxis : [
        //                 {
        //                     type: "value",
        //                     show: true,
        //                     axisLabel: {
        //                         show: true,
        //                         textStyle: {
        //                             color: "#fff",
        //                         },
        //                     },
        //                 }
        //             ],
        //
        //             series : [
        //                 {
        //                     type: "bar",
        //                     data:res.seriesData
        //                 },
        //
        //             ]
        //         });
        //         window.addEventListener('resize',function () {//执行
        //             myChart1.resize();
        //         })
        //     }
        // });
    }
   var dataGetda='5';
   //打开经济指标排名更多
   function more() {
       js.addTabPage(null, "经济指标详情","${ctx}/home/provinceMajor/list" , true);
   }
    //工作汇总

    $(function(){
        $(window).resize(function(){
            var footerHeight = $('.main-footer').outerHeight() || 0;
            var windowHeight = $(window).height();
            $('.content').css('min-height', windowHeight - footerHeight-200);
        }).resize();

        // $('.ui-sortable').sortable({
        //     connectWith : '.ui-sortable',
        //     handle      : '.box-header, .nav-tabs',
        //     placeholder : 'sort-highlight',
        //     forcePlaceholderSize: true,
        //     zIndex : 999999
        // }).find('.box-header, .nav-tabs').css('cursor', 'move');
    });

// 重置
   function ret(value) {
     if(value == 1){
         searchForm.reset();
         $("#leaderName").text('${@UserUtils.getUser().getUserName()}');
         $('#dataGrid').dataGrid('reloadGrid');
         $('.dataList1 span:last-child').addClass("active").siblings().removeClass("active");
     }else{
         searchForm2.reset();
         $('.dataList2 span:last-child').addClass("active").siblings().removeClass("active");
         $('#dataGrid2').dataGrid('reloadGrid');
     }

   }
   //工作汇总日期

   function dataGetSt(time){
       dataGetda=time;
       var taskLeader=$('#taskLeader').val();
       leaderStatistics(time,taskLeader);
       $("#dateParam").text(time)
   }
   //    状态
   function statuDetails(type){
       js.addTabPage(null, "任务明细","${ctx}/home/homePage/leaderChird?taskProgress="+type+"&taskLeader="+$('#taskLeader').val()+"&timeParam="+  dataGetda, true);
   }
   leaderStatistics('5','${@UserUtils.getUser().getUserCode()}');
   function leaderStatistics(timeParam,taskLeader) {
       $.ajax({
           url: "${ctx}/home/homePage/getRedBlue",
           type: "post",
           cache: false,
           data: {"timeParam":timeParam,"taskLeader":taskLeader},
           dataType: "json",
           success: function(res){
               $("#zhiSate").text(res[1]);
               $("#yuqiSate").text(res[2]);
               $("#xushiSate").text(res[3]);
               $("#wanSate").text(res[4]);
           }
       });
   }

//    其他领导人
   function leaderId(id,name){
       $("#searchForm #taskLeader").val(id)
     //  $("#searchForm2 #taskLeader").val(id)
       $('#dataGrid').dataGrid('reloadGrid');
    //   $('#dataGrid2').dataGrid('reloadGrid');
       var taskLeader=$('#taskLeader').val();
       leaderStatistics(dataGetda,taskLeader);
       if(name == ''){
           $("#leaderName").text('${@UserUtils.getUser().getUserName()}')
       }else{
           $("#leaderName").text(name)
       }
   }
   $("#leaderName").text('${@UserUtils.getUser().getUserName()}')
//日期切换
    $(".dataList span").click(function() {
        $(this).addClass("active").siblings().removeClass("active");
    })
   // 批示
   function clickTwo(id,taskLeader,explainContent){
       if(explainContent == "undefined"){
           explainContent = "";
       }
        explainContent =encodeURIComponent(explainContent);
       js.layer.open({
           type: 2,
           title: ['领导批示'],
           area: ['800px', '500px'],
           scrollbar: true,
           shadeClose: false,
           content: "${ctx}/home/homePage/formExplain?actionId="+id+"&explainCode="+taskLeader+"&explainContent="+explainContent,
           btn1: function (index, layero) {
           },
           end:function () {

             //  $('#dataGrid2').dataGrid('refresh', 1, 20);
           }
       });
   }

   // 最新进展
   function showLastest(id,taskLeader,explainContent){
       js.layer.open({
           type: 2,
           title: ['最新进展'],
           area: ['800px', '400px'],
           scrollbar: true,
           shadeClose: false,
           content: "${ctx}/arrange/dcSupTaskInfoArrange/getLastedArrange?taskId="+id,
           btn1: function (index, layero) {
           },
           end:function () {
              // $('#dataGrid').dataGrid('refresh', 1, 20);
              // $('#dataGrid2').dataGrid('refresh', 1, 20);
           }
       });
   }

   // 最新进展-20220811修改为展示任务内容
   function showTaskContent(id,taskLeader,explainContent){
       js.addTabPage(null, "最新进展","${ctx}/home/homePage/detailTask?id="+id+"&taskLeader="+taskLeader+"&explainContent="+explainContent, true);
   }

//    重点工作任务清单
    // 初始化DataGrid对象
    $('#dataGrid').dataGrid({
        searchForm: $("#searchForm"),
        sortableColumn: false, // 列表不允许排序
        columnModel: [
            {header:'${text("主键")}', name:'id', index:'a.id', width:150, align:"left", hidden:true},
            {header:'${text("任务标题")}', name:'taskTitle', index:'a.task_title', width:150, align:"left"
                , formatter: function(val, obj, row, act){
                    var title =encodeURIComponent(row.taskTitle);
                    return '<a href="${ctx}/home/homePage/leaderChirdDown?searchType=accurate&taskTitle='+title+'&taskLeader='+row.taskLeader+'&timeParam='+ $("#searchForm #timeParam").val()+'" class="btnList" data-title="${text("任务明细")}">'+(val||'暂无标题')+'</a>';
                }
            },
            {header:'${text("任务内容")}', name:'taskContent', index:'a.task_content', width:150, align:"left"},
            {header:'${text("任务类型")}', name:'taskTypeName', index:'a.task_type_name', width:150, align:"center"},
            // {header:'${text("牵头责任单位")}', name:'leaderOrgName', index:'a.leader_org_name', width:150, align:"center"},
            {header:'${text("任务状态")}', name:'taskProgress', index:'a.task_progress', width:50, align:"center", frozen:true, formatter: function(val, obj, row, act){
                    var taskSaF = row.taskProgress;
                    if (taskSaF == '1'){
                        //已完成
                        return '<span  style="display: inline-block;width: 10px;height: 10px;border-radius: 50%;background-color: #1abd6e;margin-right: 5px;"></span>';
                    }else if(taskSaF =='2'){
                        //序时推进
                        return '<span  style="display: inline-block;width: 10px;height: 10px;border-radius: 50%;background-color: #4b87ff;margin-right: 5px;"></span>';
                    }else if(taskSaF == '3'){
                        //进度滞后
                        return '<span  style="display: inline-block;width: 10px;height: 10px;border-radius: 50%;background-color: #ff4d4d;margin-right: 5px;"></span>';
                    }else if(taskSaF == '4'){
                        //进度滞后
                        return '<span  style="display: inline-block;width: 10px;height: 10px;border-radius: 50%;background-color: #ff4d4d;margin-right: 5px;"></span>';
                    }else{
                        return '<span  style="display: inline-block;width: 10px;height: 10px;border-radius: 50%;background-color: skyblue;margin-right: 5px;"></span>';
                    }
                }
            },
            {header:'${text("操作")}', name:'actions', width:120, align:"center",formatter: function(val, obj, row, act){
                    var actions = [];
                            actions.push('<a style="cursor:pointer;"  onclick=clickTwo("'+row.id+'","'+row.taskLeader+'","'+row.explainContent+'")  title="${text("批示")}" ><span class="btn btn-primary btn-xs">批示</span></a>&nbsp;');
                            // actions.push('<a style="cursor:pointer;" onclick=showLastest("'+row.id+'","'+''+'","'+row.explainContent+'") title="${text("最新进展")}"><span class="btn btn-primary btn-xs">最新进展</span></a>');
                            actions.push('<a style="cursor:pointer;" onclick=showTaskContent("'+row.id+'","'+row.taskLeader+'","'+row.explainContent+'") title="${text("最新进展")}"><span class="btn btn-primary btn-xs">最新进展</span></a>');
                    return actions.join('');
                }}
        ],
        autoGridHeight: true,
        ajaxSuccess: function(data){

        }
    });


/*    $('#dataGrid2').dataGrid({
        searchForm: $("#searchForm2"),
        sortableColumn: false, // 列表不允许排序
        columnModel: [
            {header:'${text("主键")}', name:'id', index:'a.id', width:150, align:"left", hidden:true},
            {header:'${text("任务标题")}', name:'taskTitle', index:'a.task_title', width:150, align:"left"
                , formatter: function(val, obj, row, act){
                    return '<a href="${ctx}/home/homePage/leaderChird?taskTitle='+row.taskTitle+'&taskLeader='+row.taskLeader+'&timeParam='+ $("#searchForm2 #timeParam").val()+'" class="btnList" data-title="${text("任务明细")}">'+(val||'暂无标题')+'</a>';
                }
            },
            {header:'${text("任务内容")}', name:'taskContent', index:'a.task_content', width:150, align:"left", formatter: function(val, obj, row, act){
                    return '<a href="${ctx}/taskdeploy/dcSupTaskInfo/detailForm?id='+row.taskId+'" class="btnList" data-title="${text("督办任务信息")}">'+(val||'暂无标题')+'</a>';
                }},
            {header:'${text("任务类型")}', name:'taskTypeName', index:'a.task_type_name', width:150, align:"center"},
            {header:'${text("牵头责任单位")}', name:'leaderOrgName', index:'a.leader_org_name', width:150, align:"center"},
            {header:'${text("任务状态")}', name:'taskProgress', index:'a.task_progress', width:150, align:"center", frozen:true, formatter: function(val, obj, row, act){
                    var taskSaF = row.taskProgress;
                    if (taskSaF == 2){
                        return '<span  style="color: #ff8b19">逾期反馈</span>';
                    }else if(taskSaF == 3){
                        return '<span  style="color: #4b87ff">序时推进</span>';
                    }else if(taskSaF == 4){
                        return '<span  style="color: #1abd6e">已完成</span>';
                    }else if(taskSaF == 1){
                        return '<span  style="color: #ff4d4d">进度滞后</span>';
                    }else{
                        return '<span  style="color: #4b87ff">无</span>';
                    }
                }
            },
            {header:'${text("操作")}', name:'actions', width:120, align:"center",formatter: function(val, obj, row, act){
                    var actions = [];
                    if(row.explainContent == ''||row.explainContent ==null){
                        actions.push('<a style="cursor:pointer;"  onclick=clickTwo("'+row.id+'","'+row.taskLeader+'","'+row.explainContent+'")  title="${text("批示")}" ><span class="btn btn-primary btn-xs">批示</span></a>&nbsp;');
                    } else {
                        // actions.push("<a href = 'javascript:js.alert(\""+row.explainContent+"\");'>查看</a>");
                        actions.push('<a style="cursor:pointer;" onclick=clickTwo("'+row.id+'","'+''+'","'+row.explainContent+'") title="${text("查看")}"><span>查看</span></a>&nbsp;');
                    }
                    actions.push('<a style="cursor:pointer;" onclick=showLastest("'+row.taskId+'","'+''+'","'+row.explainContent+'") title="${text("最新进展")}"><span>最新进展</span></a>');
                    return actions.join('');
                }}
        ],

        ajaxSuccess: function(data){

        }
    });*/
//消息
//    $(function(){
//        $.ajax({
//            url: "${ctx}/msg/listData",
//            type: "post",
//            cache: false,
//            data: {"pushed":false},
//            dataType: "json",
//            success: function(res){
//                log(res.count)
//                $("#leaderMsg").text(res.count)
//            }
//        });
//    })
</script>